<template>
  <div class="flex-1">
    <div class="mt-12px w-600px h-500px p-18px box-border overflow-auto no-scrollbar">
      <template v-if="list?.length > 0">
        <OrderCard v-for="item in list" :key="item.id" :data="item" />
      </template>
      <Empty v-else :title="'暂无订单'" />
      <pagination
        :total="total"
        :page-size="pageSize"
        :current-page="current"
        @change="handleChange"
      />
    </div>
  </div>
</template>
<script setup>
// import {  ref } from 'vue'

import pagination from '@/components/pagination/index.vue'
import OrderCard from './order-card.vue'
import Empty from '@/components/empty/index.vue'

defineProps(['list', 'total', 'pageSize', 'current'])

const emits = defineEmits(['pageChange'])
const handleChange = (page) => {
  emits('pageChange', page)
}
</script>
<style lang="less" scoped></style>
